import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import "components"
import "styles"

Rectangle {
    id: loginPage
    width: 1024
    height: 600
    color: AppStyle.backgroundColor

    property bool isLoading: false

    Rectangle {
        anchors.centerIn: parent
        width: 400
        height: 300
        color: AppStyle.cardBackgroundColor
        radius: 8
        border.color: AppStyle.borderColor
        border.width: 1

        ColumnLayout {
            anchors.centerIn: parent
            width: parent.width - 40
            spacing: 20

            Text {
                text: "浮游菌采样器控制系统"
                font.pixelSize: 24
                font.bold: true
                color: AppStyle.textColor
                Layout.alignment: Qt.AlignHCenter
            }

            Text {
                text: "用户登录"
                font.pixelSize: 16
                color: AppStyle.secondaryTextColor
                Layout.alignment: Qt.AlignHCenter
            }

            CustomTextField {
                id: usernameField
                Layout.fillWidth: true
                placeholderText: "用户名"
                enabled: !loginPage.isLoading
            }

            CustomTextField {
                id: passwordField
                Layout.fillWidth: true
                placeholderText: "密码"
                echoMode: TextInput.Password
                enabled: !loginPage.isLoading
            }

            CustomButton {
                id: loginButton
                Layout.fillWidth: true
                text: loginPage.isLoading ? "登录中..." : "登录"
                enabled: !loginPage.isLoading && usernameField.text.length > 0 && passwordField.text.length > 0
                onClicked: {
                    loginPage.isLoading = true
                    if (qmlBridge.login(usernameField.text, passwordField.text)) {
                        console.log("登录成功")
                    } else {
                        loginPage.isLoading = false
                        console.log("登录失败")
                    }
                }
            }

            Text {
                text: "默认用户名: admin, 密码: admin"
                font.pixelSize: 12
                color: AppStyle.secondaryTextColor
                Layout.alignment: Qt.AlignHCenter
            }
        }
    }

    BusyIndicator {
        anchors.centerIn: parent
        visible: loginPage.isLoading
        running: loginPage.isLoading
    }
}